<template>
	<div>
		<div class="vs-table-box" v-if="detail">
			<el-form v-loading="loading" ref="ruleForm" label-position="right" class="orm-info">
				<!-- <div style="text-align:right;margin-bottom:20px">
                    <el-button type="primary">同意</el-button>
                    <el-button type="primary">驳回</el-button>
                </div> -->
				<el-form-item label="">
					<el-descriptions border>
						<el-descriptions-item label="领用单号">{{ detail.row.number }}</el-descriptions-item>
						<el-descriptions-item label="订单状态">{{ detail.row.status | statusFilter }}</el-descriptions-item>
						<el-descriptions-item :label="detail.row.status == 1 ? '审核' : detail.row.status == 2 ? '驳回' : '取消' + '原因'" v-if="detail.row.status">
							{{ detail.row.reason }}
						</el-descriptions-item>
						<el-descriptions-item label="商品类型">{{ detail.row.goods_type | goods_typeFilter }}</el-descriptions-item>
						<el-descriptions-item label="单据备注">{{ detail.row.remarks }}</el-descriptions-item>
					</el-descriptions>
				</el-form-item>
				<el-form-item>
					<el-table :data="tableData" border style="width: 100%" v-if="detail.row.goods_type == 1 || detail.row.goods_type == 2" :key="0" show-summary :summary-method="getSummaries">
						<el-table-column prop="id" label="序号" align="center" width="100"> </el-table-column>
						<el-table-column prop="number" label="商品编码" align="center"> </el-table-column>
						<el-table-column prop="title" label="商品系列" align="center"> </el-table-column>
						<el-table-column prop="roughcast" label="毛坯种类" align="center"> </el-table-column>
						<el-table-column prop="needle" label="递针类型" align="center"> </el-table-column>
						<el-table-column prop="size" label="尺寸" align="center"> </el-table-column>
						<el-table-column prop="sex" label="性别" align="center"> </el-table-column>
						<el-table-column prop="length" label="长度" align="center"> </el-table-column>
						<el-table-column prop="colour" label="颜色" align="center"> </el-table-column>
						<el-table-column prop="price"  v-if="utils.getIsShopowner()" key="12" label="采购价" align="center"> </el-table-column>
						<el-table-column prop="retail_price" label="零售价" align="center"> </el-table-column>
						<el-table-column prop="count" label="领用数量" align="center"> </el-table-column>
						<el-table-column prop="market_priceTotal"  v-if="utils.getIsShopowner()" key="12" label="采购价总额" align="center"> </el-table-column>
						<el-table-column prop="sale_priceTotal" label="零售价总额" align="center"> </el-table-column>
					</el-table>
					<el-table :data="tableData" border style="width: 100%" v-else :key="1" show-summary :summary-method="getSummaries">
						<el-table-column prop="id" label="序号" align="center" width="100"> </el-table-column>
						<el-table-column prop="number" label="商品编码" align="center"> </el-table-column>
						<el-table-column prop="title" label="商品系列" align="center"> </el-table-column>
						<el-table-column prop="sku_text" label="规格" align="center"> </el-table-column>
						<el-table-column prop="unit" label="单位" align="center"> </el-table-column>
						<el-table-column prop="price"  v-if="utils.getIsShopowner()" key="12" label="采购价" align="center"> </el-table-column>
						<el-table-column prop="retail_price" label="零售价" align="center"> </el-table-column>
						<el-table-column prop="count" label="领用数量" align="center"> </el-table-column>
						<el-table-column prop="market_priceTotal"  v-if="utils.getIsShopowner()" key="12" label="采购价总额" align="center"> </el-table-column>
						<el-table-column prop="sale_priceTotal" label="零售价总额" align="center"> </el-table-column>
					</el-table>
				</el-form-item>
				<el-form-item label="">
					<el-descriptions border :column="4">
						<el-descriptions-item label="制单人员">{{ detail.row.create_user }}</el-descriptions-item>
						<el-descriptions-item label="制单日期">{{ detail.row.create_time.slice(0, 10) }}</el-descriptions-item>
						<el-descriptions-item v-if="detail.row.status > 1" label="审核人员">{{ detail.row.reviewer }}</el-descriptions-item>
						<el-descriptions-item v-if="detail.row.status > 1" label="审核日期">{{ detail.row.review_date }}</el-descriptions-item>
					</el-descriptions>
				</el-form-item>
			</el-form>
			<div class="vs-bottom-btns">
				<el-button @click="utils.backPage()">返回</el-button>
				<el-button v-if="detail.row.status == 0" type="primary" @click="setRow(2)">同意</el-button>
				<el-button v-if="detail.row.status == 0" type="danger" @click="setRow(3)">驳回</el-button>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				loading: false,
				detail: '',
				tableData: [],
			};
		},
		created() {
			let { id } = this.$route.query;
			if (id) {
				this.getDetail(id);
			}
		},
		filters: {
			statusFilter(val) {
				let arr = ['待审核', '已审核', '已驳回', '已取消'];
				return arr[val];
			},
			goods_typeFilter(val) {
				let arr = ['', '毛坯', '成品', '积分商品', '洗护用品', '其他'];
				return arr[val];
			},
		},
		methods: {
			getSummaries(param) {
				const { columns, data } = param;
				const sums = [];
				columns.forEach((column, index) => {
					if (index == 0) {
						sums[index] = '合计';
						return;
					}
					const values = data.map((item) => Number(item[column.property]));
					if (column.property == 'market_priceTotal' || column.property == 'sale_priceTotal') {
						sums[index] = values.reduce((prev, curr) => {
							const value = Number(curr);
							if (!isNaN(value)) {
								return prev + curr;
							} else {
								return prev;
							}
						}, 0);
						sums[index] = sums[index].toFixed(2);
					} else if (column.property == 'count') {
						sums[index] = values.reduce((prev, curr) => {
							const value = Number(curr);
							if (!isNaN(value)) {
								return prev + curr;
							} else {
								return prev;
							}
						}, 0);
					} else {
						sums[index] = '';
					}
				});
				return sums;
			},
			async setRow(type) {
				this.$prompt('原因：', `是否${type == 2 ? '同意' : '驳回'}该订单？`, {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					inputType: 'textarea',
				}).then(async ({ value }) => {
					var msg = {};
					msg.id = this.$route.query.id;
					msg.status = type - 1;
					msg.reason = value;
					let { code, data } = await this.$Http.receiveTicketReview(msg); //特殊商品
					if (code) {
						this.$message.success('操作成功');
						this.getDetail(msg.id);
					}
				});
			},
			async getDetail(id) {
				this.loading = true;
				let { code, data } = await this.$Http.receiveTicketInfo({ id });
				this.loading = false;
				if (code) {
					this.detail = data;
					this.tableData = data.info;
					for (let o of this.tableData) {
						this.$set(o, "market_priceTotal", o.price * o.count);
						this.$set(o, "sale_priceTotal", o.retail_price * o.count);
					}
				}
			},
		},
	};
</script>
<style lang="scss" scoped></style>
